<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>纯CSS商品结算清单</title>
<link type="text/css" rel="stylesheet" href="css/style4.css">
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function total(id){
	/*计算单个的价格*/
	var quantity=document.getElementById("quantity").value;
	var price=document.getElementById("price").value;
	var smallTotal=quantity*price;
	alter(smallTotal);
	var smallT=document.getElementById("smallTotal");
	smallT.innerHTML=smallTotal;
	
	/*计算总价格*/
	var totalPrice=0;
	/* for(var a=1;a<3;a++){ */
		var quantity=document.getElementById("quantity").value;
		var price=document.getElementById("price").value;
		var smallTotal=quantity*price;
		totalPrice=totalPrice+smallTotal;
		/* } */
	
	var total=document.getElementById("total");
	total.innerHTML=totalPrice;
}
</script>
<script type="text/javascript">

</script>
</head>
<body onload="ini()">
	<div class="container">
		<div class="receipt">
			<h2 class="receipt__title">感谢您的惠顾！</h2>
			<p class="receipt__subtitle">以下是您的购物清单，请保存好此票据。</p>
			<ul class="receipt__lines">
				<c:forEach items="${sessionScope.cart.map}" var="cm">
						<li class="receipt__line">
							<span class="receipt__line__item" value="${cm.value.product.product_name }">${cm.value.product.product_name }</span> 
							<span class="receipt__line__item" id="quantity" value="${cm.value.quantity }" onblur="total">${cm.value.quantity }</span>
							<span class="receipt__line__price" id="price" value="${cm.value.product.product_price }">${cm.value.product.product_price }</span> 
							<span class="receipt__line__price total" id="smallTotal" hidden=""></span>
						</li>
					</c:forEach>
				
			</ul>
			<p class="receipt__total">
			
				<span class="receipt__total__item">合计：</span>
				<span class="receipt__total__price" id="total">${sessionScope.zongjia}</span>
					
			</p>

			<p class="receipt__back">
				<a href="main.jsp">再去逛逛</a>
			</p>
		</div>

	</div>
</body>
</html>